<template>
  <view class="ver-layout">
    <!-- 根据属性  -->
    <view class="back-record-item hor-layout-side">
      <view class="title">跟进时间</view>
      <view @click="form.showTime=true">
        {{ form.created_at ? form.created_at : '请选择' }}
        <i class="iconfont right-arrow">&#xe627;</i>
      </view>
      <u-picker v-model="form.showTime" :params="timePara" :default-time="form.birthday"
                title="选择出生日期" @confirm="selectTime"></u-picker>
    </view>
    <view class="back-record-item hor-layout-side">
      <view class="title">跟进类型</view>
      <view @click="form.showType=true">
        {{ form.typeObj.label ? form.typeObj.label : '请选择' }}
        <i class="iconfont right-arrow">&#xe627;</i>
      </view>
    </view>
    <u-select v-model="form.showType" title="请选择跟进类型" :list="backTypes" @confirm="confirmSelectType"></u-select>
    <view class="back-content">
      <view>跟进内容</view>
      <u-input v-model="form.content" class="content-input" type="textarea" border></u-input>
    </view>
    <view class="confirm-btn" @click="saveBackRecord">完成</view>
  </view>
</template>

<script>
import {IntentStudentApi} from "@/api/intentStudent.js"
import {callBackRecord} from "@/router.js"

let engine = new IntentStudentApi()

export default {
  name: "addCallBackRecord",
  data() {
    return {
      timePara: {
        year: true,
        month: true,
        day: true,
        hour: false,
        minute: false,
        second: false
      },
      studentObj: {},
      form: {
        sid: '',
        type: '',
        typeObj: {},
        created_at: '',
        content: '',
        showTime: false,
        showType: false
      },
      backTypes: [
        {label: '电话跟进', value: 1},
        {label: '实地跟进', value: 2},
        {label: '对方来访', value: 3},
        {label: '线上跟进', value: 4}
      ]
    }
  },
  onLoad(options) {
    this.studentObj = options
    this.form.sid = this.studentObj.id
  },
  methods: {
    selectTime(e) {
      this.form.created_at = ''
      let {year, month, day, hour, minute, second} = this.timePara
      if (year) this.form.created_at += e.year;
      if (month) this.form.created_at += '-' + e.month;
      if (day) this.form.created_at += '-' + e.day;
      if (hour) this.form.created_at += ' ' + e.hour;
      if (minute) this.form.created_at += ':' + e.minute;
      if (second) this.form.created_at += ':' + e.second;
    },
    confirmSelectType(e) {
      let channelIndex = this.backTypes.findIndex(item => item.value === e[0].value)
      this.form.typeObj.value = [channelIndex]
      this.form.typeObj.label = e[0].label
      this.form.type = e[0].value
    },
    saveBackRecord() {
      engine.addTraceRecord(this.form).then(res => {
        if (res.code === 200) {
          this.$u.toast("添加成功！")
          this.$u.pageCallBackDelay(callBackRecord, 'getStudentDetail', '')
          this.$u.routeDelay({type: 'back'})
        }
      })
    }
  }
}
</script>

<style scoped>
.back-record-item {
  padding: 0px 13px;
  width: 100%;
  height: 48px;
  line-height: 48px;
  border-bottom: 1px solid #EAEAEA;
}

.back-record-item > * {
  font-size: 14px;
  color: #333333;
}

.right-arrow {
  margin-left: 3px;
  color: #333333;
  font-size: 13px;
}

.back-content {
  padding: 0px 13px;
  padding-top: 21px;
}

.content-input {
  margin-top: 12px;
  min-height: 250px;
  background: #EFEFEF;
}

.confirm-btn {
  position: fixed;
  bottom: 10px;
  left: 28px;
  height: 40px;
  width: calc(100% - 56px);
  text-align: center;
  line-height: 40px;
  background: #42B4AB;
  border-radius: 22px;
  /*  */
  font-size: 16px;
  font-family: Source Han Sans CN;
  font-weight: bold;
  color: #FFFFFF;
}
</style>
